import React, { Component, PropTypes } from 'react'
import { render } from 'react-dom'
import {
  applyRouterMiddleware,
  Route,
  IndexRoute,
  Router,
  hashHistory,
  withRouter,
} from 'react-router'
import { Homepage, RegisterForm, Authentication, Confirm ,RegisterResult } from './components/user'
import { AccountPage, AccountDetail, BindingCard, Subscription, Following, MyInviter } from './components/account'
import { ProjectPage, ShareProject, ProjectDetail } from './components/project'
import { MainPage } from './components/main'
import { SharePage } from './components/share'

import './statics/less/app.less'

const App = React.createClass({
  render() {
    return (
      <div className={`rt-app-container`}>
        <div id="error-notice"></div>
        {React.cloneElement(this.props.children, this.props)}
      </div>
    )
  }
});

// 验证登录
const authentication = (nextState, replace, callback) => {
  if (!sessionStorage.token) {
    replace('/login')
  }
  callback()
}

const routes = (
  <Route path="/" component={App}>
    {/* 首页 */}
    <IndexRoute component={Homepage} />
    {/* 注册 */}
    <Router path="/login" component={Homepage} />
    <Router path="/register" component={RegisterForm} />
    <Router path="/main" component={MainPage} />
    <Router path="/project" component={ProjectPage}/>
    <Router path="/register/result" component={RegisterResult} />

    <Route onEnter={authentication}>
      <Router path="/share" component={SharePage} />
      <Router path="/share/project" component={ShareProject} />
      <Router path="/account" component={AccountPage}/>
      <Router path="/project/detail" component={ProjectDetail} />
      <Router path="/account/subscription" component={Subscription}/>
      <Router path="/account/follow" component={Following}/>
      <Router path="/account/inviter" component={MyInviter}/>
      <Router path="/account/detail" component={AccountDetail}/>
      <Router path="/account/binding" component={BindingCard}/>
      <Router path="/authentication" component={Authentication} />
      <Router path="/confirm" component={Confirm} />
    </Route>
  </Route>
)


render(
  <Router history={hashHistory} routes={routes} />,
  document.getElementById('app')
)